.load {
	background: #010233;
	width: 100%;
	height: 100%;
	z-index: 10
}

.load,
.load_main {
	position: absolute
}

.load_main {
	width: 5.926rem;
	height: 5.926rem;
	left: 50%;
	top: 7.926rem;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/loading.gif) no-repeat;
	background-size: 100%
}

.load_txt {
	font-size: .5926rem;
	color: #fd005c;
	text-align: center;
	padding-top: 13.7778rem
}

.load_txt i {
	display: inline-block;
	position: relative
}

.load_txt i:after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #010233
}

.load_jdc {
	width: 3.1556rem;
	height: .6519rem;
	bottom: 1.2593rem;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	background: url() no-repeat;
	background-size: 100%
}

.load_circle,
.load_jdc {
	position: absolute;
	left: 50%
}

.load_circle {
	background: #160060
}

.load_circle,
.load_circle2 {
	border-radius: 50%;
	width: 2.963rem;
	height: 2.963rem;
	top: 9.4075rem;
	margin-left: -1.4814rem;
	opacity: 0
}

.load_circle2 {
	position: absolute;
	left: 50%;
	background: #010233
}

.load_circle3 {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/cover_bg.png) no-repeat center 20%;
	background-size: 18.4593rem
}

.load_txt i:after {
	-webkit-animation: load_txt 1.6s step-start infinite;
	animation: load_txt 1.6s step-start infinite
}

@-webkit-keyframes load_txt {
	0%,
	25% {
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
	50% {
		-webkit-transform: translateX(33.33%);
		transform: translateX(33.33%)
	}
	75% {
		-webkit-transform: translateX(66.66%);
		transform: translateX(66.66%)
	}
	to {
		-webkit-transform: translateX(100%);
		transform: translateX(100%)
	}
}

@keyframes load_txt {
	0%,
	25% {
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
	50% {
		-webkit-transform: translateX(33.33%);
		transform: translateX(33.33%)
	}
	75% {
		-webkit-transform: translateX(66.66%);
		transform: translateX(66.66%)
	}
	to {
		-webkit-transform: translateX(100%);
		transform: translateX(100%)
	}
}

.finish.load .load_jdc,
.finish.load .load_main,
.finish.load .load_txt {
	-webkit-animation: load_hide steps(1) .5s forwards;
	animation: load_hide steps(1) .5s forwards
}

.finish.load .load_circle {
	-webkit-animation: load_circle 1.5s both;
	animation: load_circle 1.5s both
}

@-webkit-keyframes load_hide {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

@keyframes load_hide {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

@-webkit-keyframes load_circle {
	0% {
		-webkit-transform: scale(0) translateY(0);
		transform: scale(0) translateY(0)
	}
	50% {
		-webkit-transform: scale(13) translateY(0);
		transform: scale(13) translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: scale(0) translateY(0);
		transform: scale(0) translateY(0);
		opacity: 1
	}
}

@keyframes load_circle {
	0% {
		-webkit-transform: scale(0) translateY(0);
		transform: scale(0) translateY(0)
	}
	50% {
		-webkit-transform: scale(13) translateY(0);
		transform: scale(13) translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: scale(0) translateY(0);
		transform: scale(0) translateY(0);
		opacity: 1
	}
}

.bg {
	position: absolute;
	opacity: 0
}

.bg,
.bg_float {
	width: 100%;
	height: 100%
}

.bg_float {
	position: relative
}

.bg_float .float {
	position: absolute
}

.bg_float .float:after {
	content: '';
	display: block;
	background-size: 100%;
	background-repeat: no-repeat
}

.bg_float .float1 {
	left: .7408rem;
	top: .963rem
}

.bg_float .float1:after {
	width: 4.1038rem;
	height: 4.1482rem;
	background-image: url()
}

.bg_float .float2 {
	right: 2.963rem;
	top: -2.1037rem
}

.bg_float .float2:after {
	width: 3.9556rem;
	height: 3.8815rem;
	background-image: url()
}

.bg_float .float3 {
	right: -5.2592rem;
	top: 5.1556rem
}

.bg_float .float3:after {
	width: 7.2889rem;
	height: 7.5556rem;
	background-image: url()
}

.bg_float .float4 {
	left: -1.2888rem;
	top: 9.7778rem
}

.bg_float .float4:after {
	width: 3.3778rem;
	height: 3.9704rem;
	background-image: url()
}

.bg_float .float5 {
	left: -2.9333rem;
	bottom: -1.7037rem
}

.bg_float .float5:after {
	width: 5.8667rem;
	height: 5.8223rem;
	background-image: url();
}

.bg_float .float6 {
	right: -1.6444rem;
	bottom: 2.1482rem
}

.bg_float .float6:after {
	width: 8.8889rem;
	height: 5.4667rem;
	background-image: url()
}

.bg.on {
	-webkit-animation: on_bgfloat 3s 1s both;
	animation: on_bgfloat 3s 1s both;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}

@-webkit-keyframes on_bgfloat {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0)
	}
	20% {
		-webkit-transform: scale(.5);
		transform: scale(.5)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_bgfloat {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0)
	}
	20% {
		-webkit-transform: scale(.5);
		transform: scale(.5)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.bg.off {
	-webkit-animation: off_bgfloat 1.5s both;
	animation: off_bgfloat 1.5s both;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%
}

@-webkit-keyframes off_bgfloat {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
	to {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
		opacity: 0
	}
}

@keyframes off_bgfloat {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
	to {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
		opacity: 0
	}
}

.bg.in {
	-webkit-animation: in_bgfloat 1.5s both;
	animation: in_bgfloat 1.5s both;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%
}

@-webkit-keyframes in_bgfloat {
	00% {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes in_bgfloat {
	00% {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.bg .float1 {
	-webkit-animation: show_bgfloat1 8s linear infinite alternate;
	animation: show_bgfloat1 8s linear infinite alternate
}

.bg .float1:after {
	-webkit-animation: show_bgfloat1_2 8s linear infinite alternate;
	animation: show_bgfloat1_2 8s linear infinite alternate
}

.bg .float2 {
	-webkit-animation: show_bgfloat2 6s linear infinite alternate;
	animation: show_bgfloat2 6s linear infinite alternate
}

.bg .float3 {
	-webkit-animation: show_bgfloat3 6s linear infinite alternate;
	animation: show_bgfloat3 6s linear infinite alternate
}

.bg .float4 {
	-webkit-animation: show_bgfloat4 8s linear infinite alternate;
	animation: show_bgfloat4 8s linear infinite alternate
}

.bg .float4:after {
	-webkit-animation: show_bgfloat4_2 8s linear infinite alternate;
	animation: show_bgfloat4_2 8s linear infinite alternate
}

.bg .float5 {
	-webkit-animation: show_bgfloat5 10s linear infinite alternate;
	animation: show_bgfloat5 10s linear infinite alternate
}

.bg .float5:after {
	-webkit-animation: show_bgfloat5_2 10s linear infinite alternate;
	animation: show_bgfloat5_2 10s linear infinite alternate
}

.bg .float6 {
	-webkit-animation: show_bgfloat6 10s linear infinite alternate;
	animation: show_bgfloat6 10s linear infinite alternate
}

.bg .float6:after {
	-webkit-animation: show_bgfloat6_2 10s linear infinite alternate;
	animation: show_bgfloat6_2 10s linear infinite alternate
}

@-webkit-keyframes show_bgfloat1 {
	0% {
		-webkit-transform: translate3d(-2.2222rem, 2.2223rem, 0);
		transform: translate3d(-2.2222rem, 2.2223rem, 0)
	}
	to {
		-webkit-transform: translate3d(2.2223rem, -2.9629rem, 0);
		transform: translate3d(2.2223rem, -2.9629rem, 0)
	}
}

@keyframes show_bgfloat1 {
	0% {
		-webkit-transform: translate3d(-2.2222rem, 2.2223rem, 0);
		transform: translate3d(-2.2222rem, 2.2223rem, 0)
	}
	to {
		-webkit-transform: translate3d(2.2223rem, -2.9629rem, 0);
		transform: translate3d(2.2223rem, -2.9629rem, 0)
	}
}

@-webkit-keyframes show_bgfloat1_2 {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
	to {
		-webkit-transform: rotate(30deg);
		transform: rotate(30deg)
	}
}

@keyframes show_bgfloat1_2 {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
	to {
		-webkit-transform: rotate(30deg);
		transform: rotate(30deg)
	}
}

@-webkit-keyframes show_bgfloat2 {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(1.4815rem, 4.4445rem, 0);
		transform: translate3d(1.4815rem, 4.4445rem, 0)
	}
}

@keyframes show_bgfloat2 {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(1.4815rem, 4.4445rem, 0);
		transform: translate3d(1.4815rem, 4.4445rem, 0)
	}
}

@-webkit-keyframes show_bgfloat3 {
	0% {
		-webkit-transform: translate3d(-5.1851rem, 0, 0);
		transform: translate3d(-5.1851rem, 0, 0)
	}
	to {
		-webkit-transform: translate3d(1.7778rem, 0, 0);
		transform: translate3d(1.7778rem, 0, 0)
	}
}

@keyframes show_bgfloat3 {
	0% {
		-webkit-transform: translate3d(-5.1851rem, 0, 0);
		transform: translate3d(-5.1851rem, 0, 0)
	}
	to {
		-webkit-transform: translate3d(1.7778rem, 0, 0);
		transform: translate3d(1.7778rem, 0, 0)
	}
}

@-webkit-keyframes show_bgfloat4 {
	0% {
		-webkit-transform: translate3d(-1.4814rem, 0, 0);
		transform: translate3d(-1.4814rem, 0, 0)
	}
	to {
		-webkit-transform: translate3d(1.4815rem, 0, 0);
		transform: translate3d(1.4815rem, 0, 0)
	}
}

@keyframes show_bgfloat4 {
	0% {
		-webkit-transform: translate3d(-1.4814rem, 0, 0);
		transform: translate3d(-1.4814rem, 0, 0)
	}
	to {
		-webkit-transform: translate3d(1.4815rem, 0, 0);
		transform: translate3d(1.4815rem, 0, 0)
	}
}

@-webkit-keyframes show_bgfloat4_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(-90deg);
		transform: rotate(-90deg)
	}
}

@keyframes show_bgfloat4_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(-90deg);
		transform: rotate(-90deg)
	}
}

@-webkit-keyframes show_bgfloat5 {
	0% {
		-webkit-transform: translate3d(-1.4814rem, 1.4815rem, 0);
		transform: translate3d(-1.4814rem, 1.4815rem, 0)
	}
	to {
		-webkit-transform: translate3d(1.4815rem, -4.4444rem, 0);
		transform: translate3d(1.4815rem, -4.4444rem, 0)
	}
}

@keyframes show_bgfloat5 {
	0% {
		-webkit-transform: translate3d(-1.4814rem, 1.4815rem, 0);
		transform: translate3d(-1.4814rem, 1.4815rem, 0);
	}
	to {
		-webkit-transform: translate3d(1.4815rem, -4.4444rem, 0);
		transform: translate3d(1.4815rem, -4.4444rem, 0);
	}
}

@-webkit-keyframes show_bgfloat5_2 {
	0% {
		-webkit-transform: rotate(10deg);
		transform: rotate(10deg)
	}
	to {
		-webkit-transform: rotate(-30deg);
		transform: rotate(-30deg)
	}
}

@keyframes show_bgfloat5_2 {
	0% {
		-webkit-transform: rotate(10deg);
		transform: rotate(10deg)
	}
	to {
		-webkit-transform: rotate(-30deg);
		transform: rotate(-30deg)
	}
}

@-webkit-keyframes show_bgfloat6 {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(2.963rem, 1.4815rem, 0);
		transform: translate3d(2.963rem, 1.4815rem, 0)
	}
}

@keyframes show_bgfloat6 {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(2.963rem, 1.4815rem, 0);
		transform: translate3d(2.963rem, 1.4815rem, 0)
	}
}

@-webkit-keyframes show_bgfloat6_2 {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
	to {
		-webkit-transform: rotate(-90deg);
		transform: rotate(-90deg)
	}
}

@keyframes show_bgfloat6_2 {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
	to {
		-webkit-transform: rotate(-90deg);
		transform: rotate(-90deg)
	}
}

.cover {
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/cover_bg.png) no-repeat center 20%;
	background-size: 18.4593rem
}

.cover,
.cover_txt {
	position: absolute;
	width: 100%;
	height: 100%
}

.cover_txt {
	left: 0;
	top: 0
}

.cover_jd {
	position: absolute;
	width: 11.5704rem;
	height: 7.926rem;
	left: 2.5186rem;
	top: 7.4075rem;
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/cover_jd.png) no-repeat;
	background-size: 100%
}

.cover_txt1 {
	position: absolute;
	width: 12.8rem;
	height: 6.0297rem;
	left: 1.526rem;
	top: 9.2741rem;
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/cover_t1.png) no-repeat;
	background-size: 100%
}

.cover_txt2 {
	position: absolute;
	width: 9.2445rem;
	height: 2.4741rem;
	left: 3.9112rem;
	top: 13.3334rem;
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/cover_t2.png) no-repeat;
	background-size: 100%
}

.cover_txt3 {
	position: absolute;
	width: 1.6rem;
	height: .8889rem;
	right: 2.0741rem;
	top: 7.7778rem;
	background: url() no-repeat;
	background-size: 100%
}

.cover_float {
	width: 100%;
	height: 100%
}

.cover_float .float {
	position: absolute
}

.cover_float .float:after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-size: 100% 100%;
	background-repeat: no-repeat
}

.cover_float .float1 {
	top: -.7407rem;
	left: .6963rem;
	width: 3.1112rem;
	height: 2.7704rem
}

.cover_float .float1:after {
	background-image: url()
}

.cover_float .float2 {
	top: -4.7407rem;
	right: -4.7407rem;
	width: 8.4741rem;
	height: 8.4741rem
}

.cover_float .float2:after {
	background-image: url()
}

.cover_float .float3 {
	top: 6.5186rem;
	left: 3.2593rem;
	width: .726rem;
	height: .726rem
}

.cover_float .float3:after {
	background-image: url()
}

.cover_float .float4 {
	top: 9.926rem;
	left: 2.7408rem;
	width: 2.3704rem;
	height: 2.3704rem
}

.cover_float .float4:after {
	background-image: url()
}

.cover_float .float5 {
	top: 6.963rem;
	right: 3.2593rem;
	width: 3.7186rem;
	height: 3.7186rem
}

.cover_float .float5:after {
	background-image: url()
}

.cover_float .float6 {
	bottom: 9.5112rem;
	right: 5.4519rem;
	width: 2.5926rem;
	height: 2.5926rem
}

.cover_float .float6:after {
	background-image: url()
}

.cover_float .float7 {
	width: .8297rem;
	height: .8297rem;
	bottom: 7.1112rem;
	right: 5.7482rem
}

.cover_float .float7:after {
	background-image: url()
}

.cover_float .float8 {
	width: 3.6593rem;
	height: 3.6593rem;
	bottom: 1.3334rem;
	left: .8889rem
}

.cover_float .float8:after {
	background-image: url()
}

.cover_float .float9 {
	width: .8rem;
	height: .8rem;
	bottom: 2.3704rem;
	left: 1.3038rem
}

.cover_float .float9:after {
	background-image: url()
}

.cover_float .float10 {
	width: 2.1038rem;
	height: 2.6075rem;
	bottom: 2.4rem;
	right: 2.4rem
}

.cover_float .float10:after {
	background-image: url()
}

.part1.in .cover {
	-webkit-animation: in_cover .5s;
	animation: in_cover .5s
}

.part1.in .cover_jd {
	-webkit-animation: in_fall 1s .5s ease-out backwards, in_float 4s 1.5s infinite alternate;
	animation: in_fall 1s .5s ease-out backwards, in_float 4s 1.5s infinite alternate
}

.part1.in .cover_txt1 {
	-webkit-animation: in_fall 1.5s .5s ease-out backwards, in_float 3s 2s infinite alternate;
	animation: in_fall 1.5s .5s ease-out backwards, in_float 3s 2s infinite alternate
}

.part1.in .cover_txt2 {
	-webkit-animation: in_fall 1.5s .5s ease backwards, in_float 3s 2s ease-out infinite alternate;
	animation: in_fall 1.5s .5s ease backwards, in_float 3s 2s ease-out infinite alternate
}

.part1.in .cover_txt3 {
	-webkit-animation: in_fall 1.5s .5s ease-out backwards, in_float 3s 2s infinite alternate;
	animation: in_fall 1.5s .5s ease-out backwards, in_float 3s 2s infinite alternate
}

.part1.in .cover_float .float1 {
	-webkit-animation: in_fall 1.4s .5s ease-out backwards, in_float1 10s 1.9s linear infinite alternate forwards;
	animation: in_fall 1.4s .5s ease-out backwards, in_float1 10s 1.9s linear infinite alternate forwards
}

.part1.in .cover_float .float1:after {
	-webkit-animation: in_float1_2 20s 1.9s linear infinite;
	animation: in_float1_2 20s 1.9s linear infinite
}

.part1.in .cover_float .float2 {
	-webkit-animation: in_fall 2s .5s ease-out backwards, in_float2 10s 2.5s linear infinite alternate;
	animation: in_fall 2s .5s ease-out backwards, in_float2 10s 2.5s linear infinite alternate
}

.part1.in .cover_float .float3 {
	-webkit-animation: in_fall 1.4s .5s ease-out backwards, in_float3 10s 1.9s linear infinite alternate;
	animation: in_fall 1.4s .5s ease-out backwards, in_float3 10s 1.9s linear infinite alternate
}

.part1.in .cover_float .float4 {
	-webkit-animation: in_fall 1.4s .5s ease-out backwards, in_float4 10s 1.9s linear infinite alternate;
	animation: in_fall 1.4s .5s ease-out backwards, in_float4 10s 1.9s linear infinite alternate
}

.part1.in .cover_float .float5 {
	-webkit-animation: in_fall 1.8s .5s ease-out backwards, in_float5 10s 2.3s linear infinite alternate;
	animation: in_fall 1.8s .5s ease-out backwards, in_float5 10s 2.3s linear infinite alternate
}

.part1.in .cover_float .float5:after {
	-webkit-animation: in_float5_2 20s 1.8s linear infinite alternate;
	animation: in_float5_2 20s 1.8s linear infinite alternate
}

.part1.in .cover_float .float6 {
	-webkit-animation: in_fall 1.4s .5s ease-out backwards, in_float6 20s 1.9s linear infinite alternate;
	animation: in_fall 1.4s .5s ease-out backwards, in_float6 20s 1.9s linear infinite alternate
}

.part1.in .cover_float .float7 {
	-webkit-animation: in_fall 1.4s .5s ease-out backwards, in_float7 10s 1.9s linear infinite alternate;
	animation: in_fall 1.4s .5s ease-out backwards, in_float7 10s 1.9s linear infinite alternate
}

.part1.in .cover_float .float8 {
	-webkit-animation: in_fall 1.6s .5s ease-out backwards, in_float8 10s 2.1s linear infinite alternate;
	animation: in_fall 1.6s .5s ease-out backwards, in_float8 10s 2.1s linear infinite alternate
}

.part1.in .cover_float .float8:after {
	-webkit-animation: in_float8_2 20s 2.1s linear infinite alternate;
	animation: in_float8_2 20s 2.1s linear infinite alternate
}

.part1.in .cover_float .float9 {
	-webkit-animation: in_fall 1.4s .5s ease-out backwards, in_float9 10s 1.9s linear infinite alternate;
	animation: in_fall 1.4s .5s ease-out backwards, in_float9 10s 1.9s linear infinite alternate
}

.part1.in .cover_float .float10 {
	-webkit-animation: in_fall 1.4s .5s ease-out backwards, in_float10 10s 1.9s linear infinite alternate;
	animation: in_fall 1.4s .5s ease-out backwards, in_float10 10s 1.9s linear infinite alternate
}

.part1.in .cover_float .float10:after {
	-webkit-animation: in_float10_2 20s 1.9s linear infinite alternate;
	animation: in_float10_2 20s 1.9s linear infinite alternate
}

@-webkit-keyframes in_cover {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@keyframes in_cover {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@-webkit-keyframes in_fall {
	0% {
		-webkit-transform: translateY(-25.7185rem);
		transform: translateY(-25.7185rem);
		opacity: 0
	}
	30% {
		-webkit-transform: translateY(1.4815rem);
		transform: translateY(1.4815rem);
		opacity: 1
	}
	50% {
		-webkit-transform: translateY(-.4444rem);
		transform: translateY(-.4444rem)
	}
	to {
		-webkit-transform: translateY(.4445rem);
		transform: translateY(.4445rem)
	}
}

@keyframes in_fall {
	0% {
		-webkit-transform: translateY(-25.7185rem);
		transform: translateY(-25.7185rem);
		opacity: 0
	}
	30% {
		-webkit-transform: translateY(1.4815rem);
		transform: translateY(1.4815rem);
		opacity: 1
	}
	50% {
		-webkit-transform: translateY(-.4444rem);
		transform: translateY(-.4444rem)
	}
	to {
		-webkit-transform: translateY(.4445rem);
		transform: translateY(.4445rem)
	}
}

@-webkit-keyframes in_float {
	0% {
		-webkit-transform: translateY(.4445rem);
		transform: translateY(.4445rem)
	}
	to {
		-webkit-transform: translateY(-.4444rem);
		transform: translateY(-.4444rem)
	}
}

@keyframes in_float {
	0% {
		-webkit-transform: translateY(.4445rem);
		transform: translateY(.4445rem)
	}
	to {
		-webkit-transform: translateY(-.4444rem);
		transform: translateY(-.4444rem)
	}
}

@-webkit-keyframes in_float1 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(0, -3.8518rem, 0);
		transform: translate3d(0, -3.8518rem, 0)
	}
}

@keyframes in_float1 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(0, -3.8518rem, 0);
		transform: translate3d(0, -3.8518rem, 0)
	}
}

@-webkit-keyframes in_float1_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

@keyframes in_float1_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

@-webkit-keyframes in_float2 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(4.4445rem, -4rem, 0);
		transform: translate3d(4.4445rem, -4rem, 0)
	}
}

@keyframes in_float2 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(4.4445rem, -4rem, 0);
		transform: translate3d(4.4445rem, -4rem, 0)
	}
}

@-webkit-keyframes in_float3 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(4.4445rem, -4rem, 0);
		transform: translate3d(4.4445rem, -4rem, 0)
	}
}

@keyframes in_float3 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(4.4445rem, -4rem, 0);
		transform: translate3d(4.4445rem, -4rem, 0)
	}
}

@-webkit-keyframes in_float4 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(-5.1851rem, -4rem, 0);
		transform: translate3d(-5.1851rem, -4rem, 0)
	}
}

@keyframes in_float4 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(-5.1851rem, -4rem, 0);
		transform: translate3d(-5.1851rem, -4rem, 0)
	}
}

@-webkit-keyframes in_float5 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(1.4815rem, -2.5185rem, 0);
		transform: translate3d(1.4815rem, -2.5185rem, 0)
	}
}

@keyframes in_float5 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(1.4815rem, -2.5185rem, 0);
		transform: translate3d(1.4815rem, -2.5185rem, 0)
	}
}

@-webkit-keyframes in_float5_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(10deg);
		transform: rotate(10deg)
	}
}

@keyframes in_float5_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(10deg);
		transform: rotate(10deg)
	}
}

@-webkit-keyframes in_float6 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(-2.9629rem, 2.963rem, 0);
		transform: translate3d(-2.9629rem, 2.963rem, 0)
	}
}

@keyframes in_float6 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(-2.9629rem, 2.963rem, 0);
		transform: translate3d(-2.9629rem, 2.963rem, 0)
	}
}

@-webkit-keyframes in_float7 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(0, 4.8889rem, 0);
		transform: translate3d(0, 4.8889rem, 0)
	}
}

@keyframes in_float7 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(0, 4.8889rem, 0);
		transform: translate3d(0, 4.8889rem, 0)
	}
}

@-webkit-keyframes in_float8 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(0, -2.9629rem, 0);
		transform: translate3d(0, -2.9629rem, 0)
	}
}

@keyframes in_float8 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(0, -2.9629rem, 0);
		transform: translate3d(0, -2.9629rem, 0)
	}
}

@-webkit-keyframes in_float8_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(40deg);
		transform: rotate(40deg)
	}
}

@keyframes in_float8_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(40deg);
		transform: rotate(40deg)
	}
}

@-webkit-keyframes in_float9 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(4.4445rem, 2.2223rem, 0);
		transform: translate3d(4.4445rem, 2.2223rem, 0)
	}
}

@keyframes in_float9 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(4.4445rem, 2.2223rem, 0);
		transform: translate3d(4.4445rem, 2.2223rem, 0)
	}
}

@-webkit-keyframes in_float10 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(5.1852rem, 4.8889rem, 0);
		transform: translate3d(5.1852rem, 4.8889rem, 0)
	}
}

@keyframes in_float10 {
	0% {
		-webkit-transform: translate3d(0, .4445rem, 0);
		transform: translate3d(0, .4445rem, 0)
	}
	to {
		-webkit-transform: translate3d(5.1852rem, 4.8889rem, 0);
		transform: translate3d(5.1852rem, 4.8889rem, 0)
	}
}

@-webkit-keyframes in_float10_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(-200deg);
		transform: rotate(-200deg)
	}
}

@keyframes in_float10_2 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(-200deg);
		transform: rotate(-200deg)
	}
}

.part1.out .cover {
	-webkit-animation: out_cover .5s forwards;
	animation: out_cover .5s forwards
}

.part1.out .cover_txt {
	-webkit-animation: out_txt 1s forwards;
	animation: out_txt 1s forwards
}

@-webkit-keyframes out_cover {
	to {
		opacity: 0;
		visibility: hidden
	}
}

@keyframes out_cover {
	to {
		opacity: 0;
		visibility: hidden
	}
}

@-webkit-keyframes out_txt {
	to {
		-webkit-transform: scale(0);
		transform: scale(0)
	}
}

@keyframes out_txt {
	to {
		-webkit-transform: scale(0);
		transform: scale(0)
	}
}

.starry {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0
}

.starry_trails {
	position: absolute;
	left: 50%;
	-webkit-transform: translate3d(-50%, -.7407rem, 0);
	transform: translate3d(-50%, -.7407rem, 0)
}

.starry_stars {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	-webkit-transform: translateZ(0);
	transform: translateZ(0)
}

.starry_stars .star,
.starry_stars .star .star_flash {
	position: absolute;
	border-radius: 100%;
	background: currentColor
}

.starry_stars .star .star_flash {
	width: 100%;
	height: 100%;
	left: 0;
	top: 0
}

.starry_stars .star .star_flash:after {
	content: "";
	position: absolute;
	background: currentColor;
	width: 150%;
	height: 150%;
	opacity: .5;
	border-radius: 100%;
	left: 50%;
	top: 50%;
	-webkit-transform: translate3d(-50%, -50%, 0);
	transform: translate3d(-50%, -50%, 0)
}

.starry_stars .star1 {
	width: .8593rem;
	height: .8593rem;
	top: 5.7926rem;
	left: 7.8223rem;
	color: #ff0464;
	-webkit-transform-origin: 0 6.0741rem;
	transform-origin: 0 6.0741rem
}

.starry_stars .star2 {
	width: .8rem;
	height: .8rem;
	bottom: 9.2149rem;
	right: 1.4963rem;
	color: #9750d5;
	-webkit-transform-origin: -6.074rem -4.074rem;
	transform-origin: -6.074rem -4.074rem
}

.starry_stars .star3 {
	width: .6519rem;
	height: .6519rem;
	top: 8.563rem;
	right: 3.3482rem;
	color: #1ddd66;
	-webkit-transform-origin: -4.3703rem 3.1852rem;
	transform-origin: -4.3703rem 3.1852rem
}

.starry_stars .star4 {
	width: .5334rem;
	height: .5334rem;
	bottom: 11.4371rem;
	right: 6.1334rem;
	color: #0079f7;
	-webkit-transform-origin: -1.5555rem -2.074rem;
	transform-origin: -1.5555rem -2.074rem
}

.starry_stars .star5 {
	width: .4445rem;
	height: .4445rem;
	bottom: 8.7112rem;
	left: 2.163rem;
	color: #fcd230;
	-webkit-transform-origin: 5.7038rem -4.8148rem;
	transform-origin: 5.7038rem -4.8148rem
}

.starry_stars .star6 {
	width: .326rem;
	height: .326rem;
	top: 9.8667rem;
	left: 3.6149rem;
	color: #23ffff;
	-webkit-transform-origin: 4.2963rem 2.1482rem;
	transform-origin: 4.2963rem 2.1482rem
}

.mainstar_wrap {
	position: absolute;
	width: 7.2rem;
	height: 7.2rem;
	top: 8.4445rem;
	left: 4.4297rem;
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/starry_bg.png) 50% no-repeat;
	background-size: 100%
}

.mainstar {
	position: absolute;
	width: 180px;
	height: 180px;
	top: 50%;
	left: 50%;
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/mainstar.png) no-repeat;
	background-size: 4320px 180px
}

.part2.in .on .starry_stars {
	-webkit-animation: in_starRotate 1s .5s both;
	animation: in_starRotate 1s .5s both
}

.part2.in .on .starry_stars .star1 .star_flash,
.part2.in .on .starry_stars .star4 .star_flash,
.part2.in .on .starry_stars .star6 .star_flash {
	-webkit-animation: starFlash 1.5s linear infinite;
	animation: starFlash 1.5s linear infinite
}

.part2.in .on .starry_stars .star2 .star_flash,
.part2.in .on .starry_stars .star3 .star_flash,
.part2.in .on .starry_stars .star5 .star_flash {
	-webkit-animation: starFlash 1.5s -.75s linear infinite;
	animation: starFlash 1.5s -.75s linear infinite
}

.part2.in .on .mainstar_wrap {
	-webkit-animation: in_mainstar 1s .5s both;
	animation: in_mainstar 1s .5s both
}

.part2.in .on .mainstar {
	-webkit-animation: mainstar 2s steps(24) infinite;
	animation: mainstar 2s steps(24) infinite
}

.part2.in .detail_menu .item:nth-child(1) {
	-webkit-animation: in_detailMenu .5s .5s both;
	animation: in_detailMenu .5s .5s both
}

.part2.in .detail_menu .item:nth-child(2) {
	-webkit-animation: in_detailMenu .5s .6s both;
	animation: in_detailMenu .5s .6s both
}

.part2.in .detail_menu .item:nth-child(3) {
	-webkit-animation: in_detailMenu .5s .7s both;
	animation: in_detailMenu .5s .7s both
}

.part2.in .detail_menu .item:nth-child(4) {
	-webkit-animation: in_detailMenu .5s .8s both;
	animation: in_detailMenu .5s .8s both
}

.part2.in .detail_menu .item:nth-child(5) {
	-webkit-animation: in_detailMenu .5s .9s both;
	animation: in_detailMenu .5s .9s both
}

.part2.in .detail_menu .item:nth-child(6) {
	-webkit-animation: in_detailMenu .5s 1s both;
	animation: in_detailMenu .5s 1s both
}

@-webkit-keyframes in_starRotate {
	0% {
		-webkit-transform: rotate(270deg) scale(0);
		transform: rotate(270deg) scale(0)
	}
	to {
		-webkit-transform: rotate(0) scale(1);
		transform: rotate(0) scale(1)
	}
}

@keyframes in_starRotate {
	0% {
		-webkit-transform: rotate(270deg) scale(0);
		transform: rotate(270deg) scale(0)
	}
	to {
		-webkit-transform: rotate(0) scale(1);
		transform: rotate(0) scale(1)
	}
}

@-webkit-keyframes starFlash {
	0% {
		-webkit-transform: scale(.5);
		transform: scale(.5);
		opacity: 1
	}
	to {
		-webkit-transform: scale(2);
		transform: scale(2);
		opacity: 0
	}
}

@keyframes starFlash {
	0% {
		-webkit-transform: scale(.5);
		transform: scale(.5);
		opacity: 1
	}
	to {
		-webkit-transform: scale(2);
		transform: scale(2);
		opacity: 0
	}
}

@-webkit-keyframes in_mainstar {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes in_mainstar {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@-webkit-keyframes mainstar {
	0% {
		background-position: 0 0
	}
	to {
		background-position: -4320px 0
	}
}

@keyframes mainstar {
	0% {
		background-position: 0 0
	}
	to {
		background-position: -4320px 0
	}
}

@-webkit-keyframes in_detailMenu {
	0% {
		-webkit-transform: translate3d(0, 1.7778rem, 0);
		transform: translate3d(0, 1.7778rem, 0);
		opacity: 0
	}
	to {
		ransform: translate3d(0, 0, 0);
		opacity: 1
	}
}

@keyframes in_detailMenu {
	0% {
		-webkit-transform: translate3d(0, 1.7778rem, 0);
		transform: translate3d(0, 1.7778rem, 0);
		opacity: 0
	}
	to {
		ransform: translate3d(0, 0, 0);
		opacity: 1
	}
}

.part2 .starry.off .starry_stars {
	-webkit-animation: off_starRotate 1s forwards;
	animation: off_starRotate 1s forwards
}

.part2 .starry.off .mainstar_wrap {
	-webkit-animation: off_mainstar 1s forwards;
	animation: off_mainstar 1s forwards
}

.part2.in.out .starry .starry_stars {
	-webkit-animation: off_starRotate 1s forwards;
	animation: off_starRotate 1s forwards
}

.part2.in.out .starry .starry_mainstar {
	-webkit-animation: off_starryMainstar 1s forwards;
	animation: off_starryMainstar 1s forwards
}

.part2.in.out .starry .mainstar_wrap {
	-webkit-animation: off_mainstar 1s forwards;
	animation: off_mainstar 1s forwards
}

.part2.in.out .detail_menu .item:nth-child(1) {
	-webkit-animation: out_detailMenu .5s .5s both;
	animation: out_detailMenu .5s .5s both
}

.part2.in.out .detail_menu .item:nth-child(2) {
	-webkit-animation: out_detailMenu .5s .4s both;
	animation: out_detailMenu .5s .4s both
}

.part2.in.out .detail_menu .item:nth-child(3) {
	-webkit-animation: out_detailMenu .5s .3s both;
	animation: out_detailMenu .5s .3s both
}

.part2.in.out .detail_menu .item:nth-child(4) {
	-webkit-animation: out_detailMenu .5s .2s both;
	animation: out_detailMenu .5s .2s both
}

.part2.in.out .detail_menu .item:nth-child(5) {
	-webkit-animation: out_detailMenu .5s .1s both;
	animation: out_detailMenu .5s .1s both
}

.part2.in.out .detail_menu .item:nth-child(6) {
	-webkit-animation: out_detailMenu .5s both;
	animation: out_detailMenu .5s both
}

@-webkit-keyframes off_mainstar {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
	to {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
}

@keyframes off_mainstar {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
	to {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
}

@-webkit-keyframes off_starRotate {
	0% {
		-webkit-transform: rotate(0) scale(1);
		transform: rotate(0) scale(1);
		opacity: 1
	}
	to {
		-webkit-transform: rotate(270deg) scale(0);
		transform: rotate(270deg) scale(0);
		opacity: 0
	}
}

@keyframes off_starRotate {
	0% {
		-webkit-transform: rotate(0) scale(1);
		transform: rotate(0) scale(1);
		opacity: 1
	}
	to {
		-webkit-transform: rotate(270deg) scale(0);
		transform: rotate(270deg) scale(0);
		opacity: 0
	}
}

@-webkit-keyframes off_starryMainstar {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

@keyframes off_starryMainstar {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

@-webkit-keyframes out_detailMenu {
	0% {
		ransform: translate3d(0, 0, 0);
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, 1.7778rem, 0);
		transform: translate3d(0, 1.7778rem, 0);
		opacity: 0
	}
}

@keyframes out_detailMenu {
	0% {
		ransform: translate3d(0, 0, 0);
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, 1.7778rem, 0);
		transform: translate3d(0, 1.7778rem, 0);
		opacity: 0
	}
}

.detail {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

.detail_menu {
	position: absolute;
	z-index: 9;
	width: 14.6963rem;
	height: 2.8741rem;
	line-height: .8rem;
	font-size: .5926rem;
	bottom: 0;
	left: 50%;
	-webkit-transform: translateX(-50%) translateZ(0);
	transform: translateX(-50%) translateZ(0);
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	text-align: center;
	color: #545454
}

.detail_menu .item {
	position: relative;
	-webkit-box-flex: 1;
	-webkit-flex: auto;
	flex: auto;
	padding: 1.0371rem 0
}

.detail_menu .item:after {
	content: "";
	position: absolute;
	width: .0889rem;
	height: .0889rem;
	border-radius: 50%;
	background: #007bfa;
	right: -.0444rem;
	top: 50%;
	-webkit-transform: translateY(-50%) translateZ(0);
	transform: translateY(-50%) translateZ(0)
}

.detail_menu .item:last-child:after {
	width: 0
}

.detail_menu .item a {
	-webkit-transition: all 1s;
	transition: all 1s
}

.detail_main {
	position: absolute;
	left: 2.5038rem;
	top: 3.1112rem;
	width: 77.5112rem;
	height: 17.4519rem;
}

.detail_item {
	position: relative;
	float: left;
	width: 10.9926rem;
	height: 17.4519rem;
	margin-right: 1.926rem;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}

.detail_item:nth-child(1) {
	color: #ff0464
}

.detail_item:nth-child(2) {
	color: #fcd230
}

.detail_item:nth-child(3) {
	color: #1ddd66
}

.detail_item:nth-child(4) {
	color: #23ffff
}

.detail_item:nth-child(5) {
	/* color:#007bfa; */
}

.detail_item:nth-child(6) {
	color: #9750d5
}

.detail_item.cur,
.detail_item.next,
.detail_item.pre {
	opacity: 1
}

.detail_item:nth-child(1) .txt {
	display: block
}

.detail_item:nth-child(1) .txt span {
	color: #73002c
}

.detail_item:nth-child(1) .txt:after {
	border-color: #73002c
}

.detail_item:nth-child(1) .txt_tit {
	color: #fff;
	border-color: #fff
}

.detail_item:nth-child(1) .ani_main {
	width: 360px;
	height: 360px
}

.detail_item:nth-child(2) .txt {
	display: block
}

.detail_item:nth-child(2) .txt span {
	color: #ac6500
}

.detail_item:nth-child(2) .txt:after {
	border-color: #ac6500
}

.detail_item:nth-child(2) .txt_tit {
	color: #ac6500;
	border-color: #ac6500
}

.detail_item:nth-child(2) .ani_main {
	width: 490px;
	height: 360px
}

.detail_item:nth-child(3) .txt {
	display: block
}

.detail_item:nth-child(3) .txt:after {
	border-color: #008c35
}

.detail_item:nth-child(3) .txt_tit {
	color: #fff;
	border-color: #fff
}

.detail_item:nth-child(3) .ani_main {
	width: 520px;
	height: 400px
}

.detail_item:nth-child(4) .txt {
	display: block;
	color: #009393
}

.detail_item:nth-child(4) .txt:after {
	border-color: #009393
}

.detail_item:nth-child(4) .txt span {
	position: relative;
	display: block;
	line-height: .6667rem;
	border: 1px solid #009393;
	padding: .1482rem .2223rem .1482rem 1.926rem;
	margin-top: .1482rem;
	background: url() no-repeat .2963rem 50%;
	background-size: 1.0667rem .8rem
}

.detail_item:nth-child(4) .txt span:before {
	content: "";
	position: absolute;
	width: 1px;
	height: 100%;
	background: #009393;
	top: 0;
	left: 1.6297rem
}

.detail_item:nth-child(4) .txt_tit {
	color: #009393;
	border-color: #009393
}

.detail_item:nth-child(4) .ani_main {
	width: 640px;
	height: 380px
}

.detail_item:nth-child(5) .txt,
.detail_item:nth-child(6) .txt {
	display: block
}

.detail_item:nth-child(5) .txt span,
.detail_item:nth-child(6) .txt span {
	position: relative;
	display: block;
	line-height: .6667rem;
	border: 1px solid #fff;
	padding: .1482rem .2223rem .1482rem 1.926rem;
	margin-top: .1482rem;
	background: url() no-repeat .2963rem 50%;
	background-size: 1.0667rem .8rem
}

.detail_item:nth-child(5) .txt span:before,
.detail_item:nth-child(6) .txt span:before {
	content: "";
	position: absolute;
	width: 1px;
	height: 100%;
	background: #fff;
	top: 0;
	left: 1.6297rem
}

.detail_item:nth-child(5) .txt_tit,
.detail_item:nth-child(6) .txt_tit {
	color: #fff;
	border-color: #fff
}

.detail_item:nth-child(5) .ani_main,
.detail_item:nth-child(6) .ani_main {
	width: 520px;
	height: 400px
}

.detail_item:nth-child(5) .txt:after {
	border-color: #00479d
}

.detail_item:nth-child(6) .txt:after {
	border-color: #6700bf
}

.detail_txt {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 4;
	background: currentColor;
	font-size: .5334rem;
	border-radius: .5926rem;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}

.detail_txt .txt {
	position: relative;
	color: #fff;
	display: none;
	padding: .7408rem .7408rem 0;
	line-height: .8297rem
}

.detail_txt .txt_tit {
	display: inline-block;
	font-size: .5334rem;
	border-bottom: 1px solid
}

.detail_txt .txt_main {
	height: 8.2963rem;
	overflow: auto;
	margin-top: .4445rem;
	-webkit-overflow-scrolling: touch
}

.detail_txt .ani {
	position: relative;
	width: 9.4815rem;
	height: 5.926rem;
	margin: 0 auto
}

.detail_txt .ani_main {
	position: absolute;
	top: 50%;
	left: 50%
}

.detail_close {
	color: currentColor;
	position: absolute;
	background: #fff;
	border-radius: 50%;
	bottom: -1.1407rem;
	left: 4.3556rem;
	z-index: 5;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}

.detail_close a {
	color: currentColor;
	display: block;
	width: 2.2815rem;
	height: 2.2815rem
}

.detail_close a:after,
.detail_close a:before {
	content: "";
	position: absolute;
	width: 1.3334rem;
	height: .2371rem;
	background: currentColor;
	border-radius: .2371rem;
	top: 50%;
	left: 50%;
	margin: -.1185rem 0 0 -.6666rem;
}

.detail_close a:before {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg)
}

.detail_close a:after {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg)
}

.detail_menu1 .item:nth-child(1) a {
	color: #ff0464
}

.detail_menu2 .item:nth-child(2) a {
	color: #fcd230
}

.detail_menu3 .item:nth-child(3) a {
	color: #1ddd66
}

.detail_menu4 .item:nth-child(4) a {
	color: #23ffff
}

.detail_menu5 .item:nth-child(5) a {
	color: #007bfa
}

.detail_menu6 .item:nth-child(6) a {
	color: #9750d5
}

.part2.in .detail.on {
	opacity: 1;
	visibility: visible
}

.part2.in .detail {
	-webkit-transition: all 1s;
	transition: all 1s;
	opacity: 0;
	visibility: hidden
}

.on .detail_item.cur .detail_txt {
	-webkit-animation: on_detail_txt 2.5s both;
	animation: on_detail_txt 2.5s both
}

.on .detail_item.cur .detail_close {
	-webkit-animation: on_detail_close 2.5s both;
	animation: on_detail_close 2.5s both
}

.on .detail_item.cur .detail_close a {
	-webkit-animation: on_detail_close_a 2.5s both;
	animation: on_detail_close_a 2.5s both
}

.on .detail_item.pre {
	-webkit-animation: on_detail_pre 1s 1.5s backwards;
	animation: on_detail_pre 1s 1.5s backwards
}

.on .detail_item.next {
	-webkit-animation: on_detail_next 1s 1.5s backwards;
	animation: on_detail_next 1s 1.5s backwards
}

@-webkit-keyframes on_detail_txt {
	0%,
	40% {
		-webkit-transform: translateY(22.6667rem);
		transform: translateY(22.6667rem);
		opacity: 0
	}
	60% {
		-webkit-transform: translateY(-.1481rem);
		transform: translateY(-.1481rem)
	}
	70% {
		-webkit-transform: translateY(.2963rem);
		transform: translateY(.2963rem)
	}
	80% {
		-webkit-transform: translateY(-.074rem);
		transform: translateY(-.074rem)
	}
	90% {
		-webkit-transform: translateY(.1482rem);
		transform: translateY(.1482rem)
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}

@keyframes on_detail_txt {
	0%,
	40% {
		-webkit-transform: translateY(22.6667rem);
		transform: translateY(22.6667rem);
		opacity: 0
	}
	60% {
		-webkit-transform: translateY(-.1481rem);
		transform: translateY(-.1481rem)
	}
	70% {
		-webkit-transform: translateY(.2963rem);
		transform: translateY(.2963rem)
	}
	80% {
		-webkit-transform: translateY(-.074rem);
		transform: translateY(-.074rem)
	}
	90% {
		-webkit-transform: translateY(.1482rem);
		transform: translateY(.1482rem)
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}

@-webkit-keyframes on_detail_close {
	0% {
		-webkit-transform: translateY(-8.7259rem);
		transform: translateY(-8.7259rem);
		opacity: 0
	}
	40% {
		-webkit-transform: translateY(-8.7259rem);
		transform: translateY(-8.7259rem);
		opacity: 1
	}
	60% {
		-webkit-transform: translateY(.4445rem);
		transform: translateY(.4445rem)
	}
	70% {
		-webkit-transform: translateY(-.2962rem);
		transform: translateY(-.2962rem)
	}
	80% {
		-webkit-transform: translateY(.2963rem);
		transform: translateY(.2963rem)
	}
	90% {
		-webkit-transform: translateY(-.1481rem);
		transform: translateY(-.1481rem)
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

@keyframes on_detail_close {
	0% {
		-webkit-transform: translateY(-8.7259rem);
		transform: translateY(-8.7259rem);
		opacity: 0
	}
	40% {
		-webkit-transform: translateY(-8.7259rem);
		transform: translateY(-8.7259rem);
		opacity: 1
	}
	60% {
		-webkit-transform: translateY(.4445rem);
		transform: translateY(.4445rem)
	}
	70% {
		-webkit-transform: translateY(-.2962rem);
		transform: translateY(-.2962rem)
	}
	80% {
		-webkit-transform: translateY(.2963rem);
		transform: translateY(.2963rem)
	}
	90% {
		-webkit-transform: translateY(-.1481rem);
		transform: translateY(-.1481rem)
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

@-webkit-keyframes on_detail_close_a {
	0% {
		-webkit-transform: rotate(-3000deg);
		transform: rotate(-3000deg)
	}
	70% {
		-webkit-transform: rotate(30deg);
		transform: rotate(30deg)
	}
	80% {
		-webkit-transform: rotate(-20deg);
		transform: rotate(-20deg)
	}
	85% {
		-webkit-transform: rotate(10deg);
		transform: rotate(10deg)
	}
	90% {
		-webkit-transform: rotate(-8deg);
		transform: rotate(-8deg)
	}
	to {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
}

@keyframes on_detail_close_a {
	0% {
		-webkit-transform: rotate(-3000deg);
		transform: rotate(-3000deg)
	}
	70% {
		-webkit-transform: rotate(30deg);
		transform: rotate(30deg)
	}
	80% {
		-webkit-transform: rotate(-20deg);
		transform: rotate(-20deg)
	}
	85% {
		-webkit-transform: rotate(10deg);
		transform: rotate(10deg)
	}
	90% {
		-webkit-transform: rotate(-8deg);
		transform: rotate(-8deg)
	}
	to {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
}

@-webkit-keyframes on_detail_pre {
	0% {
		-webkit-transform: translateX(-14.8148rem);
		transform: translateX(-14.8148rem);
		opacity: 0
	}
}

@keyframes on_detail_pre {
	0% {
		-webkit-transform: translateX(-14.8148rem);
		transform: translateX(-14.8148rem);
		opacity: 0
	}
}

@-webkit-keyframes on_detail_next {
	0% {
		-webkit-transform: translateX(14.8149rem);
		transform: translateX(14.8149rem);
		opacity: 0
	}
}

@keyframes on_detail_next {
	0% {
		-webkit-transform: translateX(14.8149rem);
		transform: translateX(14.8149rem);
		opacity: 0
	}
}

.move.detail_item {
	-webkit-animation: move_detail_txt linear .8s;
	animation: move_detail_txt linear .8s
}

.move.detail_item,
.move.detail_item.act {
	-webkit-transform-origin: 100% 100%;
	transform-origin: 100% 100%
}

.move.detail_item.act {
	-webkit-animation: move_detail_txt_act linear .8s;
	animation: move_detail_txt_act linear .8s
}

.move.detail_item .detail_close {
	-webkit-animation: move_detail_close .8s;
	animation: move_detail_close .8s
}

@-webkit-keyframes move_detail_txt {
	0%,
	70% {
		-webkit-transform: translate3d(-.5925rem, 0, 0) rotate(0);
		transform: translate3d(-.5925rem, 0, 0) rotate(0)
	}
	90% {
		-webkit-transform: translate3d(-.2962rem, 0, 0) rotate(0);
		transform: translate3d(-.2962rem, 0, 0) rotate(0)
	}
	40% {
		-webkit-transform: rotate(1deg);
		transform: rotate(1deg)
	}
	80%,
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes move_detail_txt {
	0%,
	70% {
		-webkit-transform: translate3d(-.5925rem, 0, 0) rotate(0);
		transform: translate3d(-.5925rem, 0, 0) rotate(0)
	}
	90% {
		-webkit-transform: translate3d(-.2962rem, 0, 0) rotate(0);
		transform: translate3d(-.2962rem, 0, 0) rotate(0)
	}
	40% {
		-webkit-transform: rotate(1deg);
		transform: rotate(1deg)
	}
	80%,
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@-webkit-keyframes move_detail_txt_act {
	0%,
	70% {
		-webkit-transform: translate3d(-.5925rem, 0, 0) rotate(0);
		transform: translate3d(-.5925rem, 0, 0) rotate(0)
	}
	90% {
		-webkit-transform: translate3d(-.2962rem, 0, 0) rotate(0);
		transform: translate3d(-.2962rem, 0, 0) rotate(0)
	}
	40% {
		-webkit-transform: rotate(3deg);
		transform: rotate(3deg)
	}
	80%,
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes move_detail_txt_act {
	0%,
	70% {
		-webkit-transform: translate3d(-.5925rem, 0, 0) rotate(0);
		transform: translate3d(-.5925rem, 0, 0) rotate(0)
	}
	90% {
		-webkit-transform: translate3d(-.2962rem, 0, 0) rotate(0);
		transform: translate3d(-.2962rem, 0, 0) rotate(0)
	}
	40% {
		-webkit-transform: rotate(3deg);
		transform: rotate(3deg)
	}
	80%,
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@-webkit-keyframes move_detail_close {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	40% {
		-webkit-transform: translate3d(1.7778rem, 0, 0);
		transform: translate3d(1.7778rem, 0, 0)
	}
	70% {
		-webkit-transform: translate3d(-.8888rem, 0, 0);
		transform: translate3d(-.8888rem, 0, 0)
	}
	80% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	90% {
		-webkit-transform: translate3d(-.4444rem, 0, 0);
		transform: translate3d(-.4444rem, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes move_detail_close {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	40% {
		-webkit-transform: translate3d(1.7778rem, 0, 0);
		transform: translate3d(1.7778rem, 0, 0)
	}
	70% {
		-webkit-transform: translate3d(-.8888rem, 0, 0);
		transform: translate3d(-.8888rem, 0, 0)
	}
	80% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	90% {
		-webkit-transform: translate3d(-.4444rem, 0, 0);
		transform: translate3d(-.4444rem, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.off .detail_item.cur .detail_txt {
	-webkit-animation: off_detail_txt 1.5s forwards;
	animation: off_detail_txt 1.5s forwards
}

.off .detail_item.cur .detail_close {
	-webkit-animation: off_detail_close 1.5s forwards;
	animation: off_detail_close 1.5s forwards
}

.off .detail_item.cur .detail_close a {
	-webkit-animation: off_detail_close_a 1.5s forwards;
	animation: off_detail_close_a 1.5s forwards
}

.off .detail_item.pre {
	-webkit-animation: off_detail_pre 1.5s forwards;
	animation: off_detail_pre 1.5s forwards
}

.off .detail_item.next {
	-webkit-animation: off_detail_next 1.5s forwards;
	animation: off_detail_next 1.5s forwards
}

@-webkit-keyframes off_detail_txt {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(22.6667rem);
		transform: translateY(22.6667rem);
		opacity: 0
	}
}

@keyframes off_detail_txt {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(22.6667rem);
		transform: translateY(22.6667rem);
		opacity: 0
	}
}

@-webkit-keyframes off_detail_close {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	60% {
		opacity: 1
	}
	to {
		-webkit-transform: translateY(-8.7259rem);
		transform: translateY(-8.7259rem);
		opacity: 0
	}
}

@keyframes off_detail_close {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	60% {
		opacity: 1
	}
	to {
		-webkit-transform: translateY(-8.7259rem);
		transform: translateY(-8.7259rem);
		opacity: 0
	}
}

@-webkit-keyframes off_detail_close_a {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
	to {
		-webkit-transform: rotate(-3000deg);
		transform: rotate(-3000deg)
	}
}

@keyframes off_detail_close_a {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
	to {
		-webkit-transform: rotate(-3000deg);
		transform: rotate(-3000deg)
	}
}

@-webkit-keyframes off_detail_pre {
	to {
		-webkit-transform: translateX(-14.8148rem);
		transform: translateX(-14.8148rem);
		opacity: 0
	}
}

@keyframes off_detail_pre {
	to {
		-webkit-transform: translateX(-14.8148rem);
		transform: translateX(-14.8148rem);
		opacity: 0
	}
}

@-webkit-keyframes off_detail_next {
	to {
		-webkit-transform: translateX(14.8149rem);
		transform: translateX(14.8149rem);
		opacity: 0
	}
}

@keyframes off_detail_next {
	to {
		-webkit-transform: translateX(14.8149rem);
		transform: translateX(14.8149rem);
		opacity: 0
	}
}

.detail_item.act:nth-child(1) .ani_main {
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/sc.png) no-repeat;
	background-size: 100%;
	-webkit-animation: detail_ani_main 2s 1s steps(69) infinite alternate;
	animation: detail_ani_main 2s 1s steps(69) infinite alternate
}

.detail_item.act:nth-child(2) .ani_main {
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/jr.png) no-repeat;
	background-size: 100%;
	-webkit-animation: detail_ani_main 2s 1s steps(42) infinite alternate;
	animation: detail_ani_main 2s 1s steps(42) infinite alternate
}

.detail_item.act:nth-child(3) .ani_main {
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/js.png) no-repeat;
	background-size: 100%;
	-webkit-animation: detail_ani_main 2s 1s steps(80) infinite alternate;
	animation: detail_ani_main 2s 1s steps(80) infinite alternate
}

.detail_item.act:nth-child(4) .ani_main {
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/imt.png) no-repeat;
	background-size: 100%;
	-webkit-animation: detail_ani_main 2s 1s steps(67) infinite alternate;
	animation: detail_ani_main 2s 1s steps(67) infinite alternate
}

.detail_item.act:nth-child(5) .ani_main {
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/tet.png) no-repeat;
	background-size: 100%;
	-webkit-animation: detail_ani_main 2s 1s steps(47) infinite alternate;
	animation: detail_ani_main 2s 1s steps(47) infinite alternate
}

.detail_item.act:nth-child(6) .ani_main {
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/run.png) no-repeat;
	background-size: 100%;
	-webkit-animation: detail_ani_main 2s 1s steps(58) infinite alternate;
	animation: detail_ani_main 2s 1s steps(58) infinite alternate
}

@-webkit-keyframes detail_ani_main {
	0% {
		background-position: 0 0
	}
	to {
		background-position: 0 100%
	}
}

@keyframes detail_ani_main {
	0% {
		background-position: 0 0
	}
	to {
		background-position: 0 100%
	}
}

.timeline {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0
}

.timeline_tit {
	position: relative;
	padding: 1.0075rem 0 .4445rem;
	font-size: .8889rem;
	line-height: 1.3334rem;
	color: #fff;
	text-align: center
}

.timeline_tit span {
	display: block;
	font-size: .5334rem;
	line-height: .7408rem
}

.timeline_tit:after {
	content: "";
	position: absolute;
	width: 1.363rem;
	height: 1px;
	background: red;
	bottom: 0;
	left: 50%;
	margin-left: -.6814rem
}

.timeline_icon {
	position: relative;
	width: 1.5112rem;
	height: 1.5112rem;
	margin: .5334rem auto 0;
	background: url() no-repeat 50%;
	background-size: .8445rem .7408rem
}

.timeline_icon svg {
	width: 1.4815rem;
	height: 1.4815rem;
	padding: .0149rem;
	stroke: #0084ff;
	stroke-width: 2px;
	fill: none;
	stroke-dasharray: 400
}

.timeline_list {
	position: relative;
	bottom: 0;
	height: 18.1334rem;
	margin: 0 auto;
	padding: 1.0075rem 0;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	flex-direction: column;
	color: #fff
}

.timeline_line {
	position: absolute;
	width: 1px;
	height: 100%;
	background: #0084ff;
	top: 0;
	left: 50%
}

.timeline_item {
	position: relative;
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	align-items: center;
	z-index: 9
}

.timeline_item b {
	position: absolute;
	width: .2371rem;
	height: .2371rem;
	border-radius: 50%;
	left: 50%;
	top: 50%;
	margin: -.1037rem 0 0 -.1037rem;
	z-index: 1;
	background: #fff;
	box-shadow: 0 0 0 .1926rem #0084ff
}

.timeline_item_sp b {
	background: #0084ff;
	box-shadow: none
}

.timeline_item_cnt {
	display: block;
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	flex: 1;
	padding: 0 1.4815rem
}

.timeline_item_cnt:nth-child(1) {
	text-align: right
}

.timeline_item_cnt:nth-child(2) {
	text-align: left
}

.timeline_item_cnt.flag,
.timeline_item_cnt.flag i {
	width: 1.6445rem;
	height: .963rem
}

.timeline_item_cnt.flag i {
	display: inline-block;
	background-size: 100%
}

.timeline_item_cnt.country {
	font-size: .5334rem;
	color: #66b5ff
}

.timeline_item_cnt.time {
	font-size: .5334rem
}

.timeline_item_cnt.city {
	font-size: .7112rem
}

.timeline_item_cnt .flag_sin {
	background: url() no-repeat
}

.timeline_item_cnt .flag_us {
	background: url() no-repeat
}

.timeline_item_cnt .flag_uk {
	background: url() no-repeat
}

.part3.in .timeline_item:nth-child(1) {
	-webkit-animation: on_tl_item1 .45s 2.35s ease both;
	animation: on_tl_item1 .45s 2.35s ease both
}

@-webkit-keyframes on_tl_item1 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_tl_item1 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.part3.in .timeline_item:nth-child(2) {
	-webkit-animation: on_tl_item2 .45s 2.5s ease both;
	animation: on_tl_item2 .45s 2.5s ease both
}

@-webkit-keyframes on_tl_item2 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_tl_item2 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.part3.in .timeline_item:nth-child(3) {
	-webkit-animation: on_tl_item3 .45s 2.65s ease both;
	animation: on_tl_item3 .45s 2.65s ease both
}

@-webkit-keyframes on_tl_item3 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_tl_item3 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.part3.in .timeline_item:nth-child(4) {
	-webkit-animation: on_tl_item4 .45s 2.8s ease both;
	animation: on_tl_item4 .45s 2.8s ease both
}

@-webkit-keyframes on_tl_item4 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_tl_item4 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.part3.in .timeline_item:nth-child(5) {
	-webkit-animation: on_tl_item5 .45s 2.95s ease both;
	animation: on_tl_item5 .45s 2.95s ease both
}

@-webkit-keyframes on_tl_item5 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_tl_item5 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.part3.in .timeline_item:nth-child(6) {
	-webkit-animation: on_tl_item6 .45s 3.1s ease both;
	animation: on_tl_item6 .45s 3.1s ease both
}

@-webkit-keyframes on_tl_item6 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_tl_item6 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.part3.in .timeline_item:nth-child(7) {
	-webkit-animation: on_tl_item7 .45s 3.25s ease both;
	animation: on_tl_item7 .45s 3.25s ease both
}

@-webkit-keyframes on_tl_item7 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_tl_item7 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.part3.in .timeline_item:nth-child(8) {
	-webkit-animation: on_tl_item8 .45s 3.4s ease both;
	animation: on_tl_item8 .45s 3.4s ease both
}

@-webkit-keyframes on_tl_item8 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_tl_item8 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.part3.in .timeline_item:nth-child(9) {
	-webkit-animation: on_tl_item9 .45s 3.55s ease both;
	animation: on_tl_item9 .45s 3.55s ease both
}

@-webkit-keyframes on_tl_item9 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes on_tl_item9 {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.part3.in .timeline_tit {
	-webkit-animation: on_tl_tit ease-out .4s 1.4s both;
	animation: on_tl_tit ease-out .4s 1.4s both
}

.part3.in .timeline_tit span {
	-webkit-animation: on_tl_tit_s ease-in .4s 1.4s both;
	animation: on_tl_tit_s ease-in .4s 1.4s both
}

.part3.in .timeline_tit:after {
	-webkit-animation: on_tl_tit_a .2s 1.8s both;
	animation: on_tl_tit_a .2s 1.8s both
}

.part3.in .timeline_icon {
	-webkit-animation: on_tl_icon 1.2s .5s linear both;
	animation: on_tl_icon 1.2s .5s linear both
}

.part3.in .timeline_icon svg {
	-webkit-animation: on_tl_iconsvg .5s .9s linear both;
	animation: on_tl_iconsvg .5s .9s linear both
}

.part3.in .timeline_line {
	-webkit-animation: on_tl_line 1.5s 2.2s both;
	animation: on_tl_line 1.5s 2.2s both;
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0
}

@-webkit-keyframes on_tl_tit {
	0% {
		-webkit-transform: translate3d(0, -5.9259rem, 0);
		transform: translate3d(0, -5.9259rem, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes on_tl_tit {
	0% {
		-webkit-transform: translate3d(0, -5.9259rem, 0);
		transform: translate3d(0, -5.9259rem, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@-webkit-keyframes on_tl_tit_s {
	0% {
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes on_tl_tit_s {
	0% {
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@-webkit-keyframes on_tl_tit_a {
	0% {
		-webkit-transform: scaleX(0);
		transform: scaleX(0)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@keyframes on_tl_tit_a {
	0% {
		-webkit-transform: scaleX(0);
		transform: scaleX(0)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@-webkit-keyframes on_tl_icon {
	0% {
		-webkit-transform: translateY(7.1112rem);
		transform: translateY(7.1112rem);
		opacity: 0
	}
	66.66% {
		-webkit-transform: translateY(7.1112rem);
		transform: translateY(7.1112rem);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}

@keyframes on_tl_icon {
	0% {
		-webkit-transform: translateY(7.1112rem);
		transform: translateY(7.1112rem);
		opacity: 0
	}
	66.66% {
		-webkit-transform: translateY(7.1112rem);
		transform: translateY(7.1112rem);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}

@-webkit-keyframes on_tl_iconsvg {
	0% {
		stroke-dashoffset: 400
	}
	to {
		stroke-dashoffset: 0
	}
}

@keyframes on_tl_iconsvg {
	0% {
		stroke-dashoffset: 400
	}
	to {
		stroke-dashoffset: 0
	}
}

@-webkit-keyframes on_tl_line {
	0% {
		-webkit-transform: scaleY(0);
		transform: scaleY(0)
	}
	10% {
		-webkit-transform: scaleY(.1);
		transform: scaleY(.1)
	}
	20% {
		-webkit-transform: scaleY(.2);
		transform: scaleY(.2)
	}
	30% {
		-webkit-transform: scaleY(.3);
		transform: scaleY(.3)
	}
	40% {
		-webkit-transform: scaleY(.4);
		transform: scaleY(.4)
	}
	50% {
		-webkit-transform: scaleY(.5);
		transform: scaleY(.5)
	}
	60% {
		-webkit-transform: scaleY(.6);
		transform: scaleY(.6)
	}
	70% {
		-webkit-transform: scaleY(.7);
		transform: scaleY(.7)
	}
	80% {
		-webkit-transform: scaleY(.8);
		transform: scaleY(.8)
	}
	90% {
		-webkit-transform: scaleY(.9);
		transform: scaleY(.9)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@keyframes on_tl_line {
	0% {
		-webkit-transform: scaleY(0);
		transform: scaleY(0)
	}
	10% {
		-webkit-transform: scaleY(.1);
		transform: scaleY(.1)
	}
	20% {
		-webkit-transform: scaleY(.2);
		transform: scaleY(.2)
	}
	30% {
		-webkit-transform: scaleY(.3);
		transform: scaleY(.3)
	}
	40% {
		-webkit-transform: scaleY(.4);
		transform: scaleY(.4)
	}
	50% {
		-webkit-transform: scaleY(.5);
		transform: scaleY(.5)
	}
	60% {
		-webkit-transform: scaleY(.6);
		transform: scaleY(.6)
	}
	70% {
		-webkit-transform: scaleY(.7);
		transform: scaleY(.7)
	}
	80% {
		-webkit-transform: scaleY(.8);
		transform: scaleY(.8)
	}
	90% {
		-webkit-transform: scaleY(.9);
		transform: scaleY(.9)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@-webkit-keyframes on_tl_sp {
	0% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes on_tl_sp {
	0% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

.part3.in.out .timeline_tit {
	-webkit-animation: out_tl_tit ease-out .5s both;
	animation: out_tl_tit ease-out .5s both
}

.part3.in.out .timeline_icon {
	-webkit-animation: out_tl_item .6s both;
	animation: out_tl_item .6s both
}

.part3.in.out .timeline_line {
	-webkit-animation: out_tl_line .6s both;
	animation: out_tl_line .6s both
}

.part3.in.out .timeline_item {
	-webkit-animation: out_tl_item .6s both;
	animation: out_tl_item .6s both
}

.part3.in.out .timeline_item:nth-child(1) {
	-webkit-animation-delay: 0;
	animation-delay: 0
}

.part3.in.out .timeline_item:nth-child(2) {
	-webkit-animation-delay: .05s;
	animation-delay: .05s
}

.part3.in.out .timeline_item:nth-child(3) {
	-webkit-animation-delay: .1s;
	animation-delay: .1s
}

.part3.in.out .timeline_item:nth-child(4) {
	-webkit-animation-delay: .15s;
	animation-delay: .15s
}

.part3.in.out .timeline_item:nth-child(5) {
	-webkit-animation-delay: .2s;
	animation-delay: .2s
}

.part3.in.out .timeline_item:nth-child(6) {
	-webkit-animation-delay: .25s;
	animation-delay: .25s
}

.part3.in.out .timeline_item:nth-child(7) {
	-webkit-animation-delay: .3s;
	animation-delay: .3s
}

.part3.in.out .timeline_item:nth-child(8) {
	-webkit-animation-delay: .35s;
	animation-delay: .35s
}

.part3.in.out .timeline_item:nth-child(9) {
	-webkit-animation-delay: .4s;
	animation-delay: .4s
}

@-webkit-keyframes out_tl_tit {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(-7.1111rem);
		transform: translateY(-7.1111rem);
		opacity: 0
	}
}

@keyframes out_tl_tit {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(-7.1111rem);
		transform: translateY(-7.1111rem);
		opacity: 0
	}
}

@-webkit-keyframes out_tl_line {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
	to {
		-webkit-transform: translateY(20.1482rem);
		transform: translateY(20.1482rem)
	}
}

@keyframes out_tl_line {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
	to {
		-webkit-transform: translateY(20.1482rem);
		transform: translateY(20.1482rem)
	}
}

@-webkit-keyframes out_tl_item {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(20.1482rem);
		transform: translateY(20.1482rem);
		opacity: 0
	}
}

@keyframes out_tl_item {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(20.1482rem);
		transform: translateY(20.1482rem);
		opacity: 0
	}
}

.address {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0
}

.address_logo {
	position: absolute;
	width: 14.3704rem;
	height: .9926rem;
	left: .8149rem;
	bottom: 1.1112rem;
	background: url(//jdc.jd.com/h5/jd-campus-2017/international/images/address_logo.png) no-repeat;
	background-size: 100%
}

.address_info {
	position: relative;
	padding-top: 5.0371rem;
	text-align: center
}

.address_tit {
	position: relative;
	font-size: .8889rem;
	color: #fff
}

.address_tit:after {
	content: "";
	position: absolute;
	width: 1.363rem;
	height: 1px;
	background: red;
	top: 2.0741rem;
	left: 50%;
	margin-left: -.6814rem
}

.address_item {
	font-size: 1.0667rem;
	line-height: 1.6rem;
	margin-top: 1.8963rem;
	color: #00b7ee
}

.address_item span {
	display: block;
	font-size: .5334rem;
	line-height: .7408rem;
	color: #0068c9
}

.address_btn {
	display: inline-block;
	font-size: .8889rem;
	color: #175eb5;
	line-height: 1.8371rem;
	box-shadow: 0 .7408rem 1.1852rem rgba(0, 183, 238, .25);
	width: 7.9408rem;
	height: 1.8371rem;
	margin-top: 1.8963rem;
	background: #00b7ee;
	border-radius: 1.8371rem
}

.address_btn:active {
	color: #084fa6;
	background: #0285d0
}

.part4.in .address_tit {
	-webkit-animation: in_add_tit ease-out .6s .2s both;
	animation: in_add_tit ease-out .6s .2s both
}

.part4.in .address_tit:after {
	-webkit-animation: in_add_tit_a .2s 1s both;
	animation: in_add_tit_a .2s 1s both
}

.part4.in .address_item i {
	-webkit-animation: in_add_item .1s both;
	animation: in_add_item .1s both
}

.part4.in .address_item i:nth-child(1) {
	-webkit-animation-delay: 1.2s;
	animation-delay: 1.2s
}

.part4.in .address_item i:nth-child(2) {
	-webkit-animation-delay: 1.3s;
	animation-delay: 1.3s
}

.part4.in .address_item i:nth-child(3) {
	-webkit-animation-delay: 1.4s;
	animation-delay: 1.4s
}

.part4.in .address_item i:nth-child(4) {
	-webkit-animation-delay: 1.5s;
	animation-delay: 1.5s
}

.part4.in .address_item i:nth-child(5) {
	-webkit-animation-delay: 1.6s;
	animation-delay: 1.6s
}

.part4.in .address_item i:nth-child(6) {
	-webkit-animation-delay: 1.7s;
	animation-delay: 1.7s
}

.part4.in .address_item i:nth-child(7) {
	-webkit-animation-delay: 1.8s;
	animation-delay: 1.8s
}

.part4.in .address_item i:nth-child(8) {
	-webkit-animation-delay: 1.9s;
	animation-delay: 1.9s
}

.part4.in .address_item i:nth-child(9) {
	-webkit-animation-delay: 2s;
	animation-delay: 2s
}

.part4.in .address_item i:nth-child(10) {
	-webkit-animation-delay: 2.1s;
	animation-delay: 2.1s
}

.part4.in .address_item i:nth-child(11) {
	-webkit-animation-delay: 2.2s;
	animation-delay: 2.2s
}

.part4.in .address_item i:nth-child(12) {
	-webkit-animation-delay: 2.3s;
	animation-delay: 2.3s
}

.part4.in .address_item i:nth-child(13) {
	-webkit-animation-delay: 2.4s;
	animation-delay: 2.4s
}

.part4.in .address_btn:nth-child(1) {
	-webkit-animation: in_add_btn 1.3s .8s both;
	animation: in_add_btn 1.3s .8s both;
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%
}

.part4.in .address_btn:nth-child(2) {
	-webkit-animation: in_add_btn 1.3s 1s both;
	animation: in_add_btn 1.3s 1s both;
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%
}

.part4.in .address_btn:nth-child(3) {
	-webkit-animation: in_add_btn 1.3s 1.2s both;
	animation: in_add_btn 1.3s 1.2s both;
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%
}

.part4.in .address_logo {
	-webkit-animation: in_add_logo .2s .8s both;
	animation: in_add_logo .2s .8s both
}

@-webkit-keyframes in_add_tit {
	0% {
		-webkit-transform: translate3d(0, -7.4074rem, 0);
		transform: translate3d(0, -7.4074rem, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes in_add_tit {
	0% {
		-webkit-transform: translate3d(0, -7.4074rem, 0);
		transform: translate3d(0, -7.4074rem, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@-webkit-keyframes in_add_tit_a {
	0% {
		-webkit-transform: scaleX(0);
		transform: scaleX(0)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@keyframes in_add_tit_a {
	0% {
		-webkit-transform: scaleX(0);
		transform: scaleX(0)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@-webkit-keyframes in_add_item {
	0% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes in_add_item {
	0% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@-webkit-keyframes in_add_btn {
	0% {
		-webkit-transform: translate3d(0, 14.8149rem, 0);
		transform: translate3d(0, 14.8149rem, 0);
		opacity: 0
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		opacity: 1
	}
}

@keyframes in_add_btn {
	0% {
		-webkit-transform: translate3d(0, 14.8149rem, 0);
		transform: translate3d(0, 14.8149rem, 0);
		opacity: 0
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		opacity: 1
	}
}

@-webkit-keyframes in_add_logo {
	0% {
		-webkit-transform: translate3d(0, 2.2223rem, 0);
		transform: translate3d(0, 2.2223rem, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes in_add_logo {
	0% {
		-webkit-transform: translate3d(0, 2.2223rem, 0);
		transform: translate3d(0, 2.2223rem, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.part4.out .address_tit {
	-webkit-animation: out_add_tit ease-out .6s both;
	animation: out_add_tit ease-out .6s both
}

.part4.out .address_item {
	-webkit-animation: out_add_item .4s both;
	animation: out_add_item .4s both
}

.part4.out .address_btn:nth-child(1) {
	-webkit-animation: out_add_btn .4s .2s both;
	animation: out_add_btn .4s .2s both;
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%
}

.part4.out .address_btn:nth-child(2) {
	-webkit-animation: out_add_btn .4s .1s both;
	animation: out_add_btn .4s .1s both;
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%
}

.part4.out .address_btn:nth-child(3) {
	-webkit-animation: out_add_btn .4s both;
	animation: out_add_btn .4s both;
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%
}

.part4.out .address_logo {
	-webkit-animation: out_add_logo .4s both;
	animation: out_add_logo .4s both
}

@-webkit-keyframes out_add_tit {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(0, -7.4074rem, 0);
		transform: translate3d(0, -7.4074rem, 0)
	}
}

@keyframes out_add_tit {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(0, -7.4074rem, 0);
		transform: translate3d(0, -7.4074rem, 0)
	}
}

@-webkit-keyframes out_add_item {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

@keyframes out_add_item {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

@-webkit-keyframes out_add_btn {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, 14.8149rem, 0);
		transform: translate3d(0, 14.8149rem, 0);
		opacity: 0
	}
}

@keyframes out_add_btn {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, 14.8149rem, 0);
		transform: translate3d(0, 14.8149rem, 0);
		opacity: 0
	}
}

@-webkit-keyframes out_add_logo {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(0, 2.2223rem, 0);
		transform: translate3d(0, 2.2223rem, 0)
	}
}

@keyframes out_add_logo {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(0, 2.2223rem, 0);
		transform: translate3d(0, 2.2223rem, 0)
	}
}

.progress {
	position: absolute;
	top: .9482rem;
	left: .8889rem
}

.progress svg {
	width: .4445rem;
	height: 4.7112rem
}

.progress .arrow_down,
.progress .arrow_up,
.progress .circle {
	-webkit-transition: all .48s linear;
	transition: all .48s linear
}

.progress .step0.in rect:nth-child(1) {
	-webkit-animation: stepIn .08s 0s linear forwards;
	animation: stepIn .08s 0s linear forwards
}

@-webkit-keyframes stepIn {
	to {
		fill: #fff
	}
}

.progress .step0.in rect:nth-child(2) {
	-webkit-animation: stepIn .08s .08s linear forwards;
	animation: stepIn .08s .08s linear forwards
}

.progress .step0.in rect:nth-child(3) {
	-webkit-animation: stepIn .08s .16s linear forwards;
	animation: stepIn .08s .16s linear forwards
}

.progress .step0.in rect:nth-child(4) {
	-webkit-animation: stepIn .08s .24s linear forwards;
	animation: stepIn .08s .24s linear forwards
}

.progress .step0.in rect:nth-child(5) {
	-webkit-animation: stepIn .08s .32s linear forwards;
	animation: stepIn .08s .32s linear forwards
}

.progress .step0.in rect:nth-child(6) {
	-webkit-animation: stepIn .08s .4s linear forwards;
	animation: stepIn .08s .4s linear forwards
}

.progress .step0.in rect:nth-child(7) {
	-webkit-animation: stepIn .08s .48s linear forwards;
	animation: stepIn .08s .48s linear forwards
}

.progress .step1.in rect:nth-child(1) {
	-webkit-animation: stepIn .08s 0s linear forwards;
	animation: stepIn .08s 0s linear forwards
}

.progress .step1.in rect:nth-child(2) {
	-webkit-animation: stepIn .08s .08s linear forwards;
	animation: stepIn .08s .08s linear forwards
}

.progress .step1.in rect:nth-child(3) {
	-webkit-animation: stepIn .08s .16s linear forwards;
	animation: stepIn .08s .16s linear forwards
}

.progress .step1.in rect:nth-child(4) {
	-webkit-animation: stepIn .08s .24s linear forwards;
	animation: stepIn .08s .24s linear forwards
}

.progress .step1.in rect:nth-child(5) {
	-webkit-animation: stepIn .08s .32s linear forwards;
	animation: stepIn .08s .32s linear forwards
}

.progress .step1.in rect:nth-child(6) {
	-webkit-animation: stepIn .08s .4s linear forwards;
	animation: stepIn .08s .4s linear forwards
}

.progress .step1.in rect:nth-child(7) {
	-webkit-animation: stepIn .08s .48s linear forwards;
	animation: stepIn .08s .48s linear forwards
}

.progress .step2.in rect:nth-child(1) {
	-webkit-animation: stepIn .08s 0s linear forwards;
	animation: stepIn .08s 0s linear forwards
}

.progress .step2.in rect:nth-child(2) {
	-webkit-animation: stepIn .08s .08s linear forwards;
	animation: stepIn .08s .08s linear forwards
}

.progress .step2.in rect:nth-child(3) {
	-webkit-animation: stepIn .08s .16s linear forwards;
	animation: stepIn .08s .16s linear forwards
}

.progress .step2.in rect:nth-child(4) {
	-webkit-animation: stepIn .08s .24s linear forwards;
	animation: stepIn .08s .24s linear forwards
}

.progress .step2.in rect:nth-child(5) {
	-webkit-animation: stepIn .08s .32s linear forwards;
	animation: stepIn .08s .32s linear forwards
}

.progress .step2.in rect:nth-child(6) {
	-webkit-animation: stepIn .08s .4s linear forwards;
	animation: stepIn .08s .4s linear forwards
}

.progress .step2.in rect:nth-child(7) {
	-webkit-animation: stepIn .08s .48s linear forwards;
	animation: stepIn .08s .48s linear forwards
}

@keyframes stepIn {
	to {
		fill: #fff
	}
}

.progress .step0.out rect:nth-child(1) {
	-webkit-animation: stepOut .08s .48s linear both;
	animation: stepOut .08s .48s linear both
}

@-webkit-keyframes stepOut {
	0% {
		fill: #fff
	}
	to {
		fill: #545454
	}
}

.progress .step0.out rect:nth-child(2) {
	-webkit-animation: stepOut .08s .4s linear both;
	animation: stepOut .08s .4s linear both
}

.progress .step0.out rect:nth-child(3) {
	-webkit-animation: stepOut .08s .32s linear both;
	animation: stepOut .08s .32s linear both
}

.progress .step0.out rect:nth-child(4) {
	-webkit-animation: stepOut .08s .24s linear both;
	animation: stepOut .08s .24s linear both
}

.progress .step0.out rect:nth-child(5) {
	-webkit-animation: stepOut .08s .16s linear both;
	animation: stepOut .08s .16s linear both
}

.progress .step0.out rect:nth-child(6) {
	-webkit-animation: stepOut .08s .08s linear both;
	animation: stepOut .08s .08s linear both
}

.progress .step0.out rect:nth-child(7) {
	-webkit-animation: stepOut .08s 0s linear both;
	animation: stepOut .08s 0s linear both
}

.progress .step1.out rect:nth-child(1) {
	-webkit-animation: stepOut .08s .48s linear both;
	animation: stepOut .08s .48s linear both
}

.progress .step1.out rect:nth-child(2) {
	-webkit-animation: stepOut .08s .4s linear both;
	animation: stepOut .08s .4s linear both
}

.progress .step1.out rect:nth-child(3) {
	-webkit-animation: stepOut .08s .32s linear both;
	animation: stepOut .08s .32s linear both
}

.progress .step1.out rect:nth-child(4) {
	-webkit-animation: stepOut .08s .24s linear both;
	animation: stepOut .08s .24s linear both
}

.progress .step1.out rect:nth-child(5) {
	-webkit-animation: stepOut .08s .16s linear both;
	animation: stepOut .08s .16s linear both
}

.progress .step1.out rect:nth-child(6) {
	-webkit-animation: stepOut .08s .08s linear both;
	animation: stepOut .08s .08s linear both
}

.progress .step1.out rect:nth-child(7) {
	-webkit-animation: stepOut .08s 0s linear both;
	animation: stepOut .08s 0s linear both
}

.progress .step2.out rect:nth-child(1) {
	-webkit-animation: stepOut .08s .48s linear both;
	animation: stepOut .08s .48s linear both
}

.progress .step2.out rect:nth-child(2) {
	-webkit-animation: stepOut .08s .4s linear both;
	animation: stepOut .08s .4s linear both
}

.progress .step2.out rect:nth-child(3) {
	-webkit-animation: stepOut .08s .32s linear both;
	animation: stepOut .08s .32s linear both
}

.progress .step2.out rect:nth-child(4) {
	-webkit-animation: stepOut .08s .24s linear both;
	animation: stepOut .08s .24s linear both
}

.progress .step2.out rect:nth-child(5) {
	-webkit-animation: stepOut .08s .16s linear both;
	animation: stepOut .08s .16s linear both
}

.progress .step2.out rect:nth-child(6) {
	-webkit-animation: stepOut .08s .08s linear both;
	animation: stepOut .08s .08s linear both
}

.progress .step2.out rect:nth-child(7) {
	-webkit-animation: stepOut .08s 0s linear both;
	animation: stepOut .08s 0s linear both
}

@keyframes stepOut {
	0% {
		fill: #fff
	}
	to {
		fill: #545454
	}
}

.progress0 .arrow_down {
	fill: #fff
}

.progress0 .circle {
	-webkit-transform: translateY(0);
	transform: translateY(0)
}

.progress1 .arrow_down,
.progress1 .arrow_up {
	fill: #fff
}

.progress1 .circle {
	-webkit-transform: translateY(14.7px);
	transform: translateY(14.7px)
}

.progress2 .arrow_down,
.progress2 .arrow_up {
	fill: #fff
}

.progress2 .circle {
	-webkit-transform: translateY(29.4px);
	transform: translateY(29.4px)
}

.progress3 .arrow_up {
	fill: #fff
}

.progress3 .circle {
	-webkit-transform: translateY(44.1px);
	transform: translateY(44.1px)
}

.music {
	position: absolute;
	top: .4445rem;
	right: .4445rem;
	width: 1.4815rem;
	height: 1.4815rem
}

.music:before {
	content: '';
	display: block;
	margin: .2815rem auto 0;
	width: .9482rem;
	height: .9334rem;
	background: url() no-repeat;
	background-size: 2.1186rem .9334rem
}

.music_off:before {
	background-position: -1.1851rem 0
}

.mod_container {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #010233;
	overflow: hidden;
}

.campus {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate3d(-50%, -50%, 0);
	transform: translate3d(-50%, -50%, 0);
	width: 16rem;
	height: 25.7186rem
}

.layer {
	width: 16rem;
	height: 100%
}

.in.part {
	display: block
}

.part {
	display: none
}